<!DOCTYPE html>
<html>

<head>
<title>Cindy JS Example</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="../build/js/CindyJS.css">
<script type="text/javascript" src="../build/js/Cindy.js"></script>
<script id="csinit" type="text/x-cindyscript">

// Initialization code, executed once up front.

</script>
<script id="csdraw" type="text/x-cindyscript">
lst = [1,2,3];
println("=== lists ===");
lst = [1,2,3];
lst:"age"=17;
lst:"list"=lst;
lst:"pt" = B;
println(lst:"age");
println(lst:"list");
println(lst:"pt");
println(lst:"age");

println(lst:"undef");
println(lst:pii);

lst:12.3 = 4.56;
println(lst:"12.3");


println("=== geo ===");
A:"age"=17;
A:"list"=lst;
A:"pt" = B;
println(A:"age");
println(A:"list");
println(A:"pt");

println(A:"undef");

println("debug tests");
a = [];
a:1 = 1;
a:(1+i) = 2;
errc(a:1); //gives 2, but I would expect 1 (and so does Cinderella)

a = [];
a:[1,2,3] = 10;
a:[3,4,5] = 34;
errc(a:[1,2,3]); //gives 34, Cinderella gives 10

// assigntake
a = [1,2,3];
a:"bla" = 23;

errc(a:"bla");

a_2 = 34;
errc(a:"bla");

// Drawing code, executed whenever the canvas gets redrawn.

//thing1="[-54,12]";
//thing1:"color"="red";
//errc(thing1:"color"); //should be red, but it gives blue
//
//thing2=thing1;
//thing2:"color"="blue";
//
//errc(thing1:"color"); //should be red, but it gives blue

thing1=[-54,12];
thing1:"color"="red";
//errc(thing1:"color"); 

thing2=thing1;
thing2:"color"="blue";

errc(thing1:"color"); //should be red, but it gives blue
</script>
<script type="text/javascript">

var cdy = CindyJS({ // See ref/createCindy documentation for details.
  ports: [{id: "CSCanvas", width: 500, height: 500}],
  scripts: "cs*",
  language: "en",
  defaultAppearance: {
    // See GeoBasics.js for possible attributes.
  },
  geometry: [
    {name:"A", type:"Free", pos:[0,0]},
    {name:"B", type:"Free", pos:[1,1]},
    // For allowed types, see GeoOps.js.
    // For allowed properties, see csinit in GeoBasics.js.
  ] // End of geometry array.
});

// Remove all comments after adjusting this template for your use case.

</script>
</head>

<body style="font-family:Arial;">
  <div id="CSCanvas" style="border:2px solid black"></div>
</body>

</html>
